<!DOCTYPE html>
<!-- 219970501 蔡尚儒 -->
<html>
<head>
    <meta charset="UTF-8">
    <title>用户注册验证</title>
	
</head>
<style>
 *{
	font-family:'隶书'!important;
	margin:0;
	padding:0;
	list-style:none;
}
body{
	
	background-size: 100% ;
	
	}
	
   input{
		margin:10px;
		padding:3px 2px;
		width: 400px;
		ne-block;font-size: 14px;
		}
.ingreen{
		color:green;
		}
.inred{
		color:red;
		border:none;
		background: none;
		}
span{
		display: inline-block;
		width: 60px;
		text-align:center;
		}
		
</style>
<center>
<body>

<ul id="ocheck" >
	<body background="img/2.jpg">
	<h1><br /><br /><br /><br /><br /><br /><br /><br /><br />欢迎注册蔡某的网站</h1>
    <li><span>姓名:</span><input type="text" class="oChxm" placeholder="请输入1到6位中文符" /><div class="" type="text" ></div></li>
    <li><span>手机号:</span><input type="text" class="oChphone"  placeholder="请输入正确的手机号码"/><div class="" type="text" ></div></li>
    <li><span>QQ号:</span><input type="text" class="oChQQ" placeholder="请输入正确的QQ号码"/><div class="" type="text" ></div></li>
    <li><span>邮箱:</span><input type="text" class="oChmail" placeholder="请输入正确的邮箱"/><div class="" type="text" ></div></li>
    <li><input type="button" value="提交" class="oCheckSbumit"/></li>
	</body>
</ul>
</center>
<script>

	var oCHCK = function () {
	    var chxm = false;
	    var chQQ = false;
	    var chphone = false;
	    var chMail = false;
	    var oCheck = document.getElementById('ocheck');    
	    function getByClass(o, s)
	    {
	        var aEle = document.getElementsByTagName('*');
	        var arr = [];
	        for (var i = 0; i < aEle.length; i++) {
	            if (aEle[i].className == s) {
	                arr.push(aEle[i])
	            }
	        }
	        return arr;
	    }
	
	//姓名校验
	    
	    function oChxm() {
	        var oChxm = getByClass(oCheck, 'oChxm')[0];
	        var reQQ = /[\u4E00-\u9FA5]/g;
	        oChxm.onkeyup = function () {
	            if (this.value.length > 6) {
	                this.value = this.value.substr(0, 6)
	            }
	            if (reQQ.test(this.value)) {
	                this.nextSibling.innerHTML = '名称符合要求';
	                this.nextSibling.className = '';
	                this.nextSibling.className = 'ingreen';
	                chxm = true;
	                return;
	            } else {
	                this.nextSibling.innerHTML = '请输入1到6位中文';
	                this.nextSibling.className = '';
	                this.nextSibling.className = 'inred';
	                chxm = false;
	                return;
	            }
	        }
	
	    }
	
	    oChxm();
	// 手机校验
	    function oChphone() {
	        var oChphone = getByClass(oCheck, 'oChphone')[0];
	        var reQQ = /^[1]\d{10}$/;
	        oChphone.onkeyup = function () {
	            if (this.value.length > 11) {
	                this.value = this.value.substr(0, 11)
	            }
	            if (reQQ.test(this.value)) {
	                this.nextSibling.innerHTML = '号码符合要求';
	                this.nextSibling.className = '';
	                this.nextSibling.className = 'ingreen';
	                chphone = true;
	                return;
	            } else {
	                this.nextSibling.innerHTML = '请输入正确的手机号码';
	                this.nextSibling.className = '';
	                this.nextSibling.className = 'inred';
	                chphone = false;
	                return;
	            }
	        }
	    }
	
	    oChphone();
	// QQ校验
	    function oChQQ() {
	        var oChQQ = getByClass(oCheck, 'oChQQ')[0];
	        var reQQ = /^[1-9]\d{5,12}$/;
	        oChQQ.onkeyup = function () {
	            if (this.value.length >= 14) {
	                this.value = this.value.substr(0, 14)
	            }
	            if (reQQ.test(this.value)) {
	                this.nextSibling.innerHTML = 'QQ号符合要求';
	                this.nextSibling.className = '';
	                this.nextSibling.className = 'ingreen';
	                chQQ = true;
	                return;
	            } else {
	                this.nextSibling.innerHTML = '请输入正确的QQ号码';
	                this.nextSibling.className = '';
	                this.nextSibling.className = 'inred';
	                chQQ = false;
	                return;
	            }
	        }
	    }
	
	    oChQQ();
	//邮箱校验
	    function oChmail() {
	        var oChmail = getByClass(oCheck, 'oChmail')[0];
	        var reMail = /^\w+@[a-z0-9]+\.[a-z]+$/i;
	        oChmail.onkeyup = function () {
	            if (this.value.length >= 30) {
	                this.value = this.value.substr(0, 30)
	            }
	            if (reMail.test(this.value)) {
	                this.nextSibling.innerHTML = '邮箱符合要求';
	                this.nextSibling.className = '';
	                this.nextSibling.className = 'ingreen';
	                chMail = true;
	                return;
	            } else {
	                this.nextSibling.innerHTML = '请输入正确的邮箱';
	                this.nextSibling.className = '';
	                this.nextSibling.className = 'inred';
	                chMail = false;
	                return;
	            }
	
	        }
	    }
	
	    oChmail();
	    var oCheckSbumit = getByClass(window, 'oCheckSbumit')[0];
	    oCheckSbumit.onclick = function () {
	        oCheckSbumit1();
	    };
	    function oCheckSbumit1() {
	        var chckevalue = false;
	        if (chxm == true) {
	            chckevalue = true;
	        } else {
	            alert('请输入名字');
	            return false;
	        }
	        if (chphone == true) {
	            chckevalue = true;
	        } else {
	            alert('请输入手机号');
	            return false;
	        }
	        if (chQQ == true) {
	            chckevalue = true;
	        } else {
	            alert('请输入QQ号');
	            return false;
	        }
	        if (chMail == true) {
	            chckevalue = true;
	        } else {
	            alert('请输入邮箱');
	            return false;
	        }
	        if (chckevalue == true) {
	            alert('提交成功');

	        }
	    }
	
	
	};
	oCHCK();
</script>
</body>
</html>